<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>告警人</title>
  <th:block th:include="common/pub_head :: default"></th:block>
  <th:block th:include="common/pub_head :: layui"></th:block>
</head>
<body>
<input type="hidden" id="count" />
<table class="layui-table" lay-filter="table" id='table'></table>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm layui-btn-warm" type="button" onclick="bindAlarm()">绑定告警</button>
  </div>
</script>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script th:inline="javascript">
  /*<![CDATA[*/
  var table;
  var form;
  layui.use(['table', 'form'], function () {
    table = layui.table;
    form = layui.form;

    table.render({
      elem: '#table',
      id: 'table',
      toolbar: '#toolbarDemo',
      url: path + '/alarm/listBindAlarmByParams?quartzId=' + [[${quartzId}]],
      cols: [
        [
          {field: 'nickname', title: '微信名称', width: 130},
          {
            field: 'headImgUrl', title: '头像', width: 80, align: 'center',
            templet: function (row) {
              var txt = "-";
              if (row.headImgUrl) {
                txt = "<img style='height: 28px;width: 28px;border-radius: 50%' src='" + row.headImgUrl + "'/>";
              }
              return txt;
            }
          },
          {field: 'openId', title: 'openId', width: 270},
          {
            field: 'createTime', title: '创建时间', width: 160, templet: function (row) {
              var txt = "";
              if (row.createTime) {
                txt = new Date(row.createTime).format("yyyy-MM-dd HH:mm:ss")
              }
              return txt;
            }
          },
          {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 80}
        ]
      ],
      limit: 10,
      request: {
        pageName: 'pn',
        limitName: 'pageSize' //每页数据量的参数名，默认：limit
      },
      page: true,
      done: function (res, page, count) {
        $("#count").val(count);
      }
    });

    table.on('tool(table)', function (obj) {
      var data = obj.data;
      if (obj.event === 'del') {
        delBindAlarmBean(data.id);
      }
    });
  });

  function delBindAlarmBean(id) {
    var URL = path + "/alarm/delBindAlarmBean";
    var formData = {
      id: id
    };
    layer.confirm("确定删除吗?", function() {
      var load = layer.load();
      $.post(URL, formData, function (jsonData) {
        layer.close(load);
        if (jsonData.flag) {
          listBindAlarmByParams();
          layer.msg("删除成功", {icon: 1});
        } else {
          console.log(jsonData.errorMsg);
          layer.msg("删除失败", {icon: 2});
        }
      }, "json");
    });
  }

  function listBindAlarmByParams() {
    layer.closeAll();
    table.reload('table');
  }

  function bindAlarm() {
    var URL = path + "/alarm/bindAlarm?count=" + $("#count").val();

    layer.open({
      title: "绑定告警",
      type: 2,
      area: ['305px', '350px'],
      content: URL
    });
  }

  /*]]>*/
</script>
</body>
</html>